<!DOCTYPE html>
<html lang="zh_CN">
<head>
  <meta charset="UTF-8">
  <title><%= htmlWebpackPlugin.options.title %></title>
  <meta name=Keywords content="<%= htmlWebpackPlugin.options.keywords %>">
  <meta name=Description content="<%= htmlWebpackPlugin.options.description %>">
  <link rel="shortcut icon" href="//www.artup.com/img/logoMin.ico" type="images/x-icon" />
</head>
<body style="opacity:0;">
<div id="app">
  <unify-header></unify-header>
  <suspension class="suspend" ref="suspend" :show-height="showSuspensionHeight" @mouseleave="suspendPackUp">
    <div class="container">
      <div class="upper">
        <div class="wrapper">
          <label class="suspend-label">艺术挂历</label>
          <label class="customization-item current"
                 @mouseover="suspendPullDown"
                 @click="suspendPullDown">尺寸：{{isSelect?nowSize.name:'未选择'}}</label>
          <button class="customization-btn" @click="startCustom">开始定制</button>
        </div>
      </div>
      <div class="under">
        <div class="wrapper" style="padding-left:390px;">
          <div class="suspend-size-item"
               v-for='(item,index) in attributeValues'
               :key="index"
               :class="{active:isSelect&&nowSize.code===item.code}"
               @click="isSelect=true,select(index)&&suspendPackUp()">{{item.name}}
          </div>
        </div>
      </div>
    </div>
  </suspension>
  <div class="hc-img1">
    <div class="kh-box">
      <div class="public_ol_box">
        <img v-if="!bgImgShowBool" style="top: -155px;left: 67px;"
             src="http://image2.artup.com/static/pc/gl/glbg_03.png" alt="">
        <img class="img_show" v-if="bgImgShowBool" :src="picturePrefix+previewImageUrl" alt="">
      </div>
      <ul>
        <li class="li-1">艺术挂历</li>
        <li class="li-3">世界再嘈杂，内心必须是安定的、凝固美好的瞬间。</li>
        <li class="li-3">温暖365天，使岁月充满美感。</li>
        <li class="li-4">尺寸</li>
        <li id="gl-gl">
          <ol class="ol-size">
            <li v-for="(item,index) in attributeValues"
                :key="index"
                @click="isSelect=true,select(index,index)"
                :class="{'line':isSelect&&nowSize.code==item.code}">{{item.name}}
            </li>
          </ol>
        </li>
        <li>
          <div class="pices">
            <span>{{price}}</span>&nbsp;RMB
          </div>
          <a href="javascript:void(0);" @click="startCustom" class="sib-a">开始定制</a>
        </li>
      </ul>
    </div>
  </div>
  <div class="calendarOne" ref="showSuspensionFlag">
    <div class="content">
      <div class="cont_rg">
        <strong>NEW YEARS</strong>
        <p>新一年的光影记忆<br/>凝固美好的瞬间</p>
      </div>
    </div>
  </div>
  <div class="calendarTwo">
    <div class="content">
      <div class="cont_lf">
        <strong>HAPPINESS</strong>
        <p>感动幸福瞬间，定格美好时间</p>
      </div>
    </div>
  </div>
  <div class="calendarThree">
    <div class="content">
      <div class="cont_lf">
        <strong>HANDTAILOR</strong>
        <p>用你的照片定制专属挂历</p>
        <span>自选封面及12张内页 可任意选择起始月份</span>
      </div>
    </div>
  </div>
  <div class="calendarFour">
    <div class="content">
      <div class="cont_rg">
        <strong>MULTIPLE CHOICE</strong>
        <p>多种规格 打造你的家居空间</p>
        <span>高档PVC磨砂材质封面 硬质 透光 使挂历平整美观 <br/>横版 竖版 迷你版 随心装饰家居及办公空间</span>
      </div>
    </div>
  </div>
  <unify-footer></unify-footer>
</div>
</body>
</html>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-113376322-1"></script>
<script>
  window.dataLayer = window.dataLayer || []
  function gtag() {
    dataLayer.push(arguments)
  }
  gtag('js', new Date())

  gtag('config', 'UA-113376322-1')
</script>
<style>
  .atrup_Message{
    width: 30px;
    height: 30px;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    left:-6px;
    background: url("http://image2.artup.com/static/pc/imgs/common/logo_1.jpg") no-repeat ;
    background-size: 100% 100%;
  }
</style>
